<template>
  <div class="">
    <u-modal
      v-model="visible"
      :title-style="{ color: 'red' }"
      border-radius="0"
      :showTitle="false"
      confirm-text="确认取消"
      confirm-color="#FF874FFF"
      :async-close="true"
      @confirm="onConfirmClick"
    >
      <view class="confirm-text"> 是否取消订单？ </view>
    </u-modal>
    <!-- toast -->
    <u-toast ref="uToast" />
  </div>
</template>
<script>
import { orderCancel } from "@/api/qccx.js";
export default {
  data() {
    return {
      visible: false,
      form: {},
    };
  },
  methods: {
    show(record) {
      this.visible = true;
      this.form.id = record.id;
    },
    onConfirmClick() {
      orderCancel(this.form).then((res) => {
        if (res.code == 200) {
          this.$refs.uToast.show({ title: "操作成功" });
          this.visible = false;
          this.$emit("success");
        }
      });
    },
  },
};
</script>
<style lang="scss" scoped>
.confirm-text {
  font-size: 32rpx;
  color: #1a1a1a;
  line-height: 48rpx;
  padding: 64rpx 48rpx;
  text-align: center;
}
</style>
